<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="script/jquery-1.11.3.js"></script>
<link rel="stylesheet" href="bootstrap-3.0.3/css/bootstrap.min.css">
<script type="text/javascript" src="bootstrap-3.0.3/js/bootstrap.js"></script>
<script type="text/javascript" src="script/jquery.validate.min.js"></script>
<script type="text/javascript" src="script/messages_zh.js"></script>
<script type="text/javascript"
	src="http://api.map.baidu.com/api?v=2.0&ak=C2b42eb4a9ea4cd555d0fc891caf9095"></script>
</head>
<body>
	<div class="container">
		<%@ include file="shared/front_header.jsp"%>
		<div class="row">
			<div class="col-md-9 col-md-push-3" style="left: 269px">
				<form id="myform" class="form-horizontal" action="addPhoto" 
					 enctype="multipart/form-data"  method="post">
					 
					 <input type="text" name="hourseId" value="${houseId }"/>
					 
					<div class="control-group">
						<label class="control-label" for="inputTitle">照片名称：</label>
						<div class="controls">
							<input type="text" id="inputTitle" placeholder="title"
								name="title" required/> <label class="error"></label>
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputPhoto">添加图片：</label>
						<div class="controls">
							<input type="file" id="inputPhoto" 
								name="coverImages" required /> <label class="error"></label>
						</div>
					</div>
					
					
					<div class="control-group">
						<div class="controls">
							<br />
							<button type="submit" class="btn">添加图片</button>
						</div>
					</div>
				</form>

			</div>

			<%@ include file="shared/nav.jsp"%>

		</div>



	</div>
	
	<script type="text/javascript">
		// 初始化地图：广州，12级精度
		var map = new BMap.Map("allmap");
		map.centerAndZoom("广州", 16);
		//启用滚轮放大缩小，默认禁用
		map.enableScrollWheelZoom();

		//在框中显示经纬度
		function showCurrentLocation(locationPoint) {
			$("#point").val(locationPoint.lng + ',' + locationPoint.lat);
			$("#latitude").val(locationPoint.lat);
			$("#longitude").val(locationPoint.lng);
		}
		//在地图上更新标记
		function refreshOverlay(locationPoint) {
			map.clearOverlays(); //清除覆盖物
			var mk = new BMap.Marker(locationPoint); //添加覆盖点
			map.addOverlay(mk);
			map.panTo(locationPoint); //转转义中心
		}

		//使用浏览器定位当前位置   
		var geolocation = new BMap.Geolocation();
		geolocation.getCurrentPosition(function(r) {
			if (this.getStatus() == BMAP_STATUS_SUCCESS) {
				//更新地图标记及显示经纬度
				refreshOverlay(r.point);
				showCurrentLocation(r.point);
			} else {
				alert('failed' + this.getStatus());
			}
		}, {
			enableHighAccuracy : true
		})

		map.addEventListener('click', function(e) {
			//更新地图标记及显示经纬度
			refreshOverlay(e.point);
			showCurrentLocation(e.point);
			//根据经纬坐标解释地址
			var geo = new BMap.Geocoder();
			geo.getLocation(e.point, function(r) {
				$("#address").val(r.address);
			});
		});

		$("#search").click(function() {
			// 创建地址解析器实例
			var myGeo = new BMap.Geocoder();
			// 将地址解析结果显示在地图上,并调整地图视野
			myGeo.getPoint($("#address").val(), function(point) {
				if (point) {
					//更新地图标记及显示经纬度
					showCurrentLocation(point);
					refreshOverlay(point);
				} else {
					alert("您选择地址没有解析到结果!");
				}
			}, "广州市");
		})
	</script>
	
</body>
</html>